interface ConnectionStatusProps {
  ip: string;
  isConnected: boolean;
}

export default function ConnectionStatus({ ip, isConnected }: ConnectionStatusProps) {
  return (
    <div className="flex items-center gap-2 group relative">
      <span className={`w-3 h-3 rounded-full ${isConnected ? 'bg-green-500' : 'bg-red-500'}`}></span>
      <span className="text-sm font-medium">{isConnected ? '已连接' : '未连接'}</span>
      
      {/* 悬停时显示IP地址 */}
      <div className="absolute left-0 top-full mt-1 bg-gray-800 text-white text-xs py-1 px-2 rounded whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none">
        {ip}
      </div>
    </div>
  );
}